<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ page import="java.util.List"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="java.util.Calendar"%>
<%@ page import="java.util.Arrays"%>
<%@ page import="java.text.SimpleDateFormat"%>

<%@ page import="com.udata.server.persistence.dao.CurrencyRateDao"%>


<html>
<head>
<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<meta name="keywords" content="Currency,Game,Article,Image">
<meta name="description" content="Data storage and analysis">
<meta charset="UTF-8">



<link rel="stylesheet" type="text/css"
	href="/css/jquery.mobile-1.4.0.min.css">
<script src="/js/jquery-1.10.2.min.js"></script>
<script src="/js/jquery.mobile-1.4.0.min.js"></script>
<title>Udatas</title>
</head>
<body>
	<div class="menu-icon">
		<a href="/"><button id="home-button"
				class="ui-btn ui-shadow ui-corner-all ui-icon-home ui-btn-icon-notext ui-btn-inline"></button></a>
		<button
			class="ui-btn ui-shadow ui-corner-all ui-icon-info ui-btn-icon-notext ui-btn-inline"></button>
		<button
			class="ui-btn ui-shadow ui-corner-all ui-icon-user ui-btn-icon-notext ui-btn-inline"></button>
		<button
			class="ui-btn ui-shadow ui-corner-all ui-icon-action ui-btn-icon-notext ui-btn-inline"></button>
		<button
			class="ui-btn ui-shadow ui-corner-all ui-icon-gear ui-btn-icon-notext ui-btn-inline"></button>
	</div>


	<div data-role="footer">
		<div data-role="navbar">
			<ul>
				<li><button id="date-left-button"
						class="ui-btn ui-shadow ui-corner-all  ui-icon-arrow-l ui-btn-icon-notext ui-btn-inline"></button></li>
				<li id="datepicker"></li>
				<li><button id="date-right-button"
						class="ui-btn ui-shadow ui-corner-all  ui-icon-arrow-r ui-btn-icon-notext ui-btn-inline"></button></li>
			</ul>
		</div>
		<%
			String url = request.getRequestURL().toString();
			String[] urlArray = url.split("/");
			String to = urlArray[urlArray.length - 1];
		%>
	</div>
	<ul data-role="listview">
		<li id="currencyDisplay"></li>
	</ul>



	<script>
	window.onload= function()
	{
	var date=new Date();
	$("#datepicker").text(date.toDateString());
	
	var dateStr=getDate(date);
	var url="/currencyRate?action=getCurrency&from=EUR&to=<%=to%>&startDate="+dateStr+"&endDate="+dateStr;	

    getCurrency(date);
	} 
 
	$("#date-right-button").click(function(){
	  var date=  new Date($("#datepicker").text());
	  date.setDate(date.getDate()+1);
	  $("#datepicker").text(date.toDateString());
	    getCurrency(date);

	  
	});
	$("#date-left-button").click(function(){
	  var date=  new Date($("#datepicker").text());
	  date.setDate(date.getDate()-1);
	  $("#datepicker").text(date.toDateString());
	     getCurrency(date);
	  
	});
	
	
	
	
	
	function getDate(date)
	{
	var curr_date = date.getDate();
    var curr_month = date.getMonth() + 1; 
    var curr_year = date.getFullYear()
	var dateStr=curr_year+""+curr_month+curr_date;
	
	return dateStr;
	}
	
	
	function getCurrency(date){
		  var dateStr=getDate(date);
		  var url="/currencyRate?action=getCurrency&from=EUR&to=<%=to%>&startDate="+dateStr+"&endDate="+dateStr;	
	
	
						console.log(url);
	$("#currencyDisplay").text("");
	 	$.ajax({
				type : "get",
				url : url,
				contentType : "application/json",
				timeout : 100000,
				beforeSend : function(XMLHttpRequest) {
				},
				success : function(data) {
				var dataJson = jQuery.parseJSON(data);
				    	console.log(dataJson);

				    if(dataJson.length==1)
				    {
				    	console.log(dataJson[0].rate);
				    	$("#currencyDisplay").text("<%=to%>"+":"+dataJson[0].rate);
				    }
				},
				complete : function(XMLHttpRequest, textStatus) {
				},
				error : function(xhr, ajaxOptions, thrownError) {
				console.log("error:"+xhr.status+","+thrownError);
				}
			});
	};
	
	</script>
</body>
</html>